// pages/category/category.js
import { Category } from "../../models/category";
import { config } from "../../config/config";
Page({
  /**
   * 页面的初始数据
   */
  data: {
    navHeight: '',
    menuButtonInfo: {},
    searchMarginTop: 0, // 搜索框上边距
    searchWidth: 0, // 搜索框宽度
    searchHeight: 0, // 搜索框高度
    navList: [],
    subList: [],
    subListOri: [],
    mainActiveIndex: 0,
    activeId: 1,
    banner: [
      {
        img: config.imgUrl + "tab-bar/T1.jpg"
      },
      {
        img: config.imgUrl + "tab-bar/T2.jpg"
      },
      {
        img: config.imgUrl + "tab-bar/T3.jpg"
      }
    ]
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {
    this.setData({
      menuButtonInfo: wx.getMenuButtonBoundingClientRect()
    })
    console.log(this.data.menuButtonInfo)
    const { top, width, height, right } = this.data.menuButtonInfo
    wx.getSystemInfo({
      success: (res) => {
        const { statusBarHeight } = res
        const margin = top - statusBarHeight
        this.setData({
          navHeight: (height + statusBarHeight + (margin * 2)),
          searchMarginTop: statusBarHeight + margin, // 状态栏 + 胶囊按钮边距
          searchHeight: height,  // 与胶囊按钮同高
          searchWidth: right - width // 胶囊按钮右边坐标 - 胶囊按钮宽度 = 按钮左边可使用宽度
        })
      },
    })
    this.getDataList();
  },
  onClickNav(e) {
    let list = [];
    if (e.detail.index == 0) {
      list = this.data.subListOri;
    } else {
      let id = this.data.navList[e.detail.index].Id;
      list = this.data.subListOri.filter(item => {
        return item.ClassifyId == id;
      });
    }

    console.log(list);
    this.setData({
      mainActiveIndex: e.detail.index,
      subList: list
    });
  },
  onClickItem(e) {
    console.log("onClickItem");
    console.log(e);
    this.setData({
      activeId: e.detail.id
    });
  },
  itemClick(e) {
    console.log(e);
    let id = e.target.dataset.id;
    let cid = e.target.dataset.cid;
    wx.navigateTo({
      url: `/pages/product/product?id=${id}&cid=${cid}`
    });
  },

  async getDataList() {
    let postData = {
      PageIndex: 1,
      PageRows: 100,
      SortField: "id",
      SortType: "asc"
    };
    const data = await Category.GetDataList(postData);
    data.Data.map(item => {
      item.text = item.Name;
    });
    if (data.Data && data.Data.length > 0) {
      this.Subclassfy(data.Data[0].Id);
    }
    this.setData({
      navList: data.Data
    });
  },

  async Subclassfy() {
    let postData = {
      PageIndex: 1,
      PageRows: 100,
      SortField: "id",
      SortType: "asc"
    };
    const data = await Category.Subclassfy(postData);
    data.Data.map(item => {
      if (item.Imags) {
        item.src = item.Imags.split(",")[0];
      } else {
        item.src = "";
      }
    });

    this.setData({
      subList: data.Data,
      subListOri: data.Data
    });
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function() {},

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function() {},

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function() {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function() {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function() {},

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function() {},

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function() {}
});
